<template>
	<view class="flowLaunch-v">
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :sticky="true"
			:down="downOption" :up="upOption">
			<view class="search-box">
				<view style="display: flex;">
					<view style="flex:0 0 33.3%;">
						<u-button type="primary" plain @click="handleTake">接收</u-button>
					</view>
					<view style="flex:1">
						<u-button type="success" plain @click="handleInbound">入库单</u-button>
					</view>
					<view style="flex:0 0 33.3%;">
						<u-button type="warning" plain @click="handleSave">报工</u-button>
					</view>
				</view>
				<view style="display: flex; padding: 15rpx;">
					<u-search placeholder="请选择工艺" v-model="ub004Name" height="72" disabled @click="selectShow = true"
						:show-action="false">
					</u-search>
					<u-search placeholder="请输入机台" v-model="queryForm.machineValue" height="72" :show-action="false">
					</u-search>
				</view>
				<!-- #ifdef APP-PLUS -->
				<u-subsection :list="lsubsectionList" :current="current" @change="sectionChange"></u-subsection>
				<!-- 手机 -->
				<view style="display: flex; padding: 15rpx;" v-show="current===0">
					<u-search placeholder="请扫开工号" search-icon="scan" v-model="queryForm.startNumber" height="72"
						:show-action="false" @focus="focusStart('APP','开工')">
					</u-search>
					<u-search placeholder="请扫暂停号" search-icon="scan" v-model="queryForm.pauseNumber" height="72"
						:show-action="false" @focus="focusPause('APP','暂停')">
					</u-search>
				</view>
				<!-- 扫码枪 -->
				<view style="display: flex; padding: 15rpx;" v-show="current===1">
					<u-button type="primary" plain @click="focusStart('PDA','开工')">
						<u-icon label="开工" size="40" name="scan"></u-icon>
					</u-button>
					<u-button type="primary" plain @click="focusPause('PDA','暂停')">
						<u-icon label="暂停" size="40" name="scan"></u-icon>
					</u-button>
				</view>
				<!-- #endif -->
				<!-- #ifdef H5 -->
				<view>
					<view style="margin-bottom: 15rpx;">
						<u-search placeholder="请扫开工号" search-icon="scan" v-model="queryForm.startNumber" height="72"
							@search="focusStart('H5','开工')">
						</u-search>
					</view>
					<u-search placeholder="请扫暂停号" search-icon="scan" v-model="queryForm.pauseNumber" height="72"
						@search="focusPause('H5','暂停')">
					</u-search>
				</view>
				<!-- #endif -->

			</view>
			<view class="flow-list" v-if="list.length > 0">
				<view class="flow-list-box" v-for="(item, index) in list" :key="item.id">
					<u-swipe-action :index="index" :show="item.show" @click="handleClick" @open="open"
						@content-click="goDetail(item)" class='swipe-action'>
						<view class="item">
							<view class="item-left">
								<text class="title u-line-1 u-font-24">
									工单单号:<text class="titInner">{{item.ua002}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									批次简码:<text class="titInner">{{item.ua013}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									投产批次号:<text class="titInner">{{item.ua005}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									工艺名称:<text class="titInner">{{item.mw002}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									批次数量:<text class="titInner">{{item.ua007}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									已投入数量:<text class="titInner">{{item.ub010}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									已接收数量:<text class="titInner">{{item.ub205}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									已产出数量:<text class="titInner">{{item.ub011}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									已报废数量:<text class="titInner">{{item.ub012}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									待投入数量:<text class="titInner">
										{{(item.ub010 - item.ub011 - item.ub012).toFixed(3) }}
									</text>
								</text>
								<text class="title u-line-1 u-font-24">
									已投产数量:<text class="titInner">{{item.ua012}}</text>
								</text>
								<text class="title u-line-1 u-font-24">
									附件:<jnpf-file v-model="item.annex" />
								</text>
							</view>
							<view class="item-right">
								<u-tag v-if="item.ub204 == '1'" text="已开工"></u-tag>
								<u-tag v-else-if="item.ub204 == '3'" type="warning" text="暂停"></u-tag>
								<u-tag v-else-if="item.ub204 == '4'" type="success" text="完工"></u-tag>
								<u-tag v-else type="error" text="未开工"></u-tag>
							</view>
						</view>
					</u-swipe-action>
				</view>
			</view>
		</mescroll-body>

		<u-modal v-model="pauseNumberShow" :show-cancel-button="true" @confirm="pauseConfirm">
			<u-form :model="dialogForm" ref="dialogForm" :errorType="['toast']" label-position="left"
				label-align="left">
				<u-form-item label="暂停原因">
					<u-input v-model="ug009Name" type="select" border placeholder="暂停原因"
						@click="selectPauseShow = true"></u-input>
				</u-form-item>
				<u-form-item label="暂停备注">
					<u-input v-model="dialogForm.ug010" type="textarea" border placeholder="暂停备注"></u-input>
				</u-form-item>
			</u-form>
		</u-modal>

		<u-modal v-model="comShow" :show-cancel-button="true" :show-confirm-button="false" title=''>
			<u-form :errorType="['toast']" label-position="left" label-align="left">
				<u-form-item :label="comName+'号'">
					<u-input v-model="comNumber" :placeholder="'请扫描'+comName+'号'" :focus="true"></u-input>
				</u-form-item>
			</u-form>
		</u-modal>
		<u-select v-model="selectShow" :list="processOptions" @confirm="selectConfirm"></u-select>
		<u-select v-model="selectPauseShow" :list="ug009Options" @confirm="selectPauseConfirm"></u-select>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import resources from '@/libs/resources.js'
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import {
		FlowLaunchList,
		Delete
	} from '@/api/workFlow/flowLaunch'
	import {
		getDataInterfaceRes,
		getDictionaryDataSelector,
		getWorkOrderList,
		UpdateStatus
	} from '@/api/common'
	import request from "@/utils/request";
	export default {
		mixins: [MescrollMixin],
		watch: {
			"comNumber": {
				handler(newVal, oldVal) {
					if (newVal) {
						setTimeout(() => {
							if (this.comName === '开工') {
								this.queryForm.startNumber = newVal
								this.handleStates(1, newVal)
							}
							if (this.comName === '完工') {
								this.queryForm.endNumber = newVal
								this.handleStates(4, newVal)
							}
							if (this.comName === '暂停') {
								this.queryForm.pauseNumber = newVal
								this.pauseNumberShow = true;
							}
							this.comShow = false
						}, 500)
					}

				},
				deep: true,
			},
		},
		data() {
			return {
				current: 1,
				lsubsectionList: [{
						name: '手机'
					},
					{
						name: '扫码枪'
					}
				],
				comShow: false,
				pauseNumberShow: false,
				selectShow: false,
				selectPauseShow: false,
				processOptions: [],
				ug009Options: [],
				flowStatus: '',
				downOption: {
					use: true,
					auto: true
				},
				upOption: {
					page: {
						num: 0,
						size: 10,
						time: null
					},
					empty: {
						use: true,
						icon: resources.message.nodata,
						tip: "暂无数据",
						fixed: true,
						top: "300rpx",
					},
					textNoMore: '没有更多数据',
				},
				keyword: '',
				list: [],
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#dd524d'
					}
				}, ],
				queryForm: {
					startNumber: undefined, //开工号
					endNumber: undefined, //完工号
					pauseNumber: undefined, //暂停号
					machineValue: undefined, //机台
					ub004: undefined //工艺
				},
				workOrderListQuery: {
					currentPage: 1,
					pageSize: 10,
					sort: "desc",
					sidx: "",
				},

				ub004Name: null,
				ug009Name: null,
				StartTimer: null,
				dialogForm: {
					ug009: null,
					ug010: null,
				},
				comName: null,
				comNumber: null,
			}
		},
		onLoad() {
			uni.$on('refresh', () => {
				this.list = [];
				this.mescroll.resetUpScroll();
			})
		},
		onShow() {
			this.getProessOptions()
			this.getUg009Options()
		},
		onUnload() {
			uni.$off('refresh')
		},
		methods: {
			// 扫码开工
			focusStart(type, name) {
				this.comName = name
				if (!this.queryForm.ub004) {
					return this.$refs.uToast.show({
						title: "请先选择工艺",
						type: "error",
					});
				}
				if (type === 'APP') {
					uni.scanCode({
						success: (res) => {
							this.queryForm.startNumber = res.result
							this.handleStates(1, res.result)
						}
					});
				} else if (type === 'PDA') {
					this.comNumber = null;
					this.comShow = true
				} else {
					this.handleStates(1, this.queryForm.startNumber)
				}
			},
			// 扫码完工
			focusEnd(type, name) {
				this.comName = name
				if (!this.queryForm.ub004) {
					return this.$refs.uToast.show({
						title: "请先选择工艺",
						type: "error",
					});
				}
				if (type === 'APP') {
					uni.scanCode({
						success: (res) => {
							this.queryForm.endNumber = res.result
							this.handleStates(4, res.result)
						}
					});
				} else if (type === 'PDA') {
					this.comNumber = null;
					this.comShow = true
				} else {
					this.handleStates(4, this.queryForm.endNumber)
				}
			},
			// 扫码暂停
			focusPause(type, name) {
				this.comName = name
				//工艺不能为空
				if (!this.queryForm.ub004) {
					return this.$refs.uToast.show({
						title: "请先选择工艺",
						type: "error",
					});
				}

				if (type === 'APP') {
					uni.scanCode({
						success: (res) => {
							this.queryForm.pauseNumber = res.result;
							this.pauseNumberShow = true;
						}
					});
				} else if (type === 'PDA') {
					this.comNumber = null;
					this.comShow = true;
				} else {
					this.pauseNumberShow = true;
				}
			},
			// 扫码暂停提交
			pauseConfirm() {
				var param = {
					pauseNumber: this.queryForm.pauseNumber, //暂停编号
					craftNumber: this.queryForm.ub004, //工艺编号
					craftStatus: "3", //暂停
					ug009: this.dialogForm.ug009, //暂停原因
					ug010: this.dialogForm.ug010, //暂停备注
				};
				request({
						url: `/api/SubDev/Sfcug/PauseHandle`,
						method: "PUT",
						data: param,
					}).then(res => {
						this.$refs.uToast.show({
							title: res.msg,
							type: "primary",
						});
						this.seset()
					})
					.catch(() => {
						this.seset()
					})
			},
			// 开工完工提交
			handleStates(status, number) {
				var param = {
					citationNumber: number, //传票号
					ub004: this.queryForm.ub004, //工艺编号
					ub204: status, //完工状态
				}
				UpdateStatus(param).then(res => {
						this.$refs.uToast.show({
							title: res.msg,
							type: "primary",
						});
						this.seset()
					})
					.catch(() => {
						this.seset()
					})
			},
			// 接收按钮
			handleTake() {
				if (!this.queryForm.ub004) {
					return this.$refs.uToast.show({
						title: "请先选择工艺",
						type: "error",
					});
				}
				uni.navigateTo({
					url: `/pages/workFlow/productionScan/com/takeOver?ub004Name=${this.ub004Name}&ub004=${this.queryForm.ub004}`
				});
			},
			// 保存按钮
			handleSave() {
				if (!this.queryForm.ub004 && !this.queryForm.machineValue) {
					return this.$refs.uToast.show({
						title: "请先选择工艺",
						type: "error",
					});
				}
				uni.navigateTo({
					url: `/pages/workFlow/productionScan/com/saveOver?ub004Name=${this.ub004Name}&ub004=${this.queryForm.ub004}&machine=${this.queryForm.machineValue}`
				});
			},
			// 入库单按钮
			handleInbound() {
				uni.navigateTo({
					url: `/pages/workFlow/productionScan/com/inOver`
				});
			},
			// 重置表单
			seset() {
				this.queryForm.startNumber = undefined;
				this.queryForm.endNumber = undefined;
				this.queryForm.pauseNumber = undefined;
				this.mescroll.resetUpScroll();
			},
			sectionChange(index) {
				this.current = index;
			},
			selectConfirm(e) {
				this.ub004Name = e[0].label
				this.queryForm.ub004 = e[0].value
				this.search()
			},
			// 
			selectPauseConfirm(e) {
				this.ug009Name = e[0].label
				this.dialogForm.ug009 = e[0].value
			},
			//获取工艺列表
			getProessOptions() {
				getDataInterfaceRes("362117530153654853").then((res) => {
					this.processOptions = res.data.data.map(item => {
						return {
							label: item.JoinStr,
							value: item.MW001,
						}
					});
				});
			},
			//获取暂停原因
			getUg009Options() {
				getDictionaryDataSelector("565765578413895813").then((res) => {
					this.ug009Options = res.data.list.map(item => {
						return {
							label: item.fullName,
							value: item.enCode,
						}
					});
				});
			},
			upCallback(page) {
				let _query = {
					...this.workOrderListQuery,
					...this.queryForm,
					currentPage: page.num,
					pageSize: page.size,
				};
				let query = {};
				for (let key in _query) {
					if (Array.isArray(_query[key])) {
						query[key] = _query[key].join();
					} else {
						query[key] = _query[key];
					}
				}
				getWorkOrderList(query, {
					load: page.num == 1
				}).then(res => {
					this.mescroll.endSuccess(res.data.list.length);
					if (page.num == 1) this.list = [];
					this.list = res.data.list
				}).catch(() => {
					this.mescroll.endErr();
				})
			},
			getFlowStatus(status) {
				let flowStatus;
				switch (status) {
					case 0: //等待提交
						flowStatus = resources.status.submit
						break;
					case 1: //等待审核
						flowStatus = resources.status.review
						break;
					case 2: //审核通过
						flowStatus = resources.status.reviewAdopt
						break;
					case 3: //审核驳回
						flowStatus = resources.status.reviewRefuse
						break;
					case 4: //流程撤回
						flowStatus = resources.status.reviewUndo
						break;
					case 5: //审核终止
						flowStatus = resources.status.reviewStop
						break;
					default: //等待审核
						flowStatus = resources.status.review
						break;
				}
				return flowStatus
			},
			handleClick(index, index1) {},
			open(index) {
				this.list[index].show = true;
				this.list.map((val, idx) => {
					if (index != idx) this.list[idx].show = false;
				})
			},
			search() {
				// 节流,避免输入过快多次请求
				this.searchTimer && clearTimeout(this.searchTimer)
				this.searchTimer = setTimeout(() => {
					this.list = [];
					this.mescroll.resetUpScroll();
				}, 300)
			},
			goDetail(item) {},

		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f0f2f6;
	}

	.search-box {
		height: 370rpx;
	}

	/*  #ifdef  H5  */
	.search-box {
		height: 380rpx;
	}

	/*  #endif  */
	.flowLaunch-v {
		width: 100%;

		.flow-list-box {
			width: 95%;
		}
	}


	.flow-list {
		.flow-list-box {
			margin: 20rpx;

			.u-swipe-content {
				width: calc(100% - 180rpx);
			}

			.u-swipe-action {
				border-radius: 20rpx;
			}

			.item {
				width: 100%;
				display: flex;
				flex-direction: row;
				padding: 20rpx 20rpx;
				background-color: #fff;
				border-radius: 20rpx;
				height: 500rpx;

				.item-left {
					flex: 1;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					align-items: flex-start;
					overflow: hidden;
					text-overflow: ellipsis;

					.title {
						width: 100%;
						overflow: hidden;
						text-overflow: ellipsis;
						color: #2a2a2a;

						.titInner {
							margin-left: 10rpx;
							color: #606060;
						}
					}
				}

				.item-right {
					display: flex;
					align-items: center;
					justify-content: flex-end;

					.item-right-img {
						width: 102rpx;
					}
				}
			}
		}
	}
</style>